<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>我的通知</title>
    <link rel="stylesheet" href="../../css/mdui.css">
    <link rel="stylesheet" href="../../css/main.css">
</head>

<body class="mdui-appbar-with-toolbar mdui-appbar-with-tab mdui-color-grey-50">

    <!-- 顶部导航栏 -->
    <header>
        <div class="mdui-appbar mdui-appbar-fixed mdui-appbar-scroll-toolbar-hide">
            <div class="mdui-toolbar mdui-color-deep-purple">
                <a href="../index.html" class="mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">home</i></a>
                <a href="../index.html" class="mdui-typo-title">操作系统学习平台</a>
                <div class="mdui-toolbar-spacer"></div>
                <!-- 一个通知按钮 -->
                <a href="../Personal/notice.html">
                    <span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white">
                            <i class="mdui-icon material-icons">notifications</i>
                        </span>
                </a>

                <span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white" mdui-menu="{target: '#login-menu'}">
                        <i class="mdui-icon material-icons">account_circle</i>
                    </span>
                <!-- 小菜单 -->

                <ul class="mdui-menu mdui-menu-cascade mdui-menu-cascade-custom" id="login-menu">
                    <li class="mdui-menu-item">
                        <div class="mdui-row mdui-valign">
                            <div class="mdui-col-md-3 mdui-m-l-3">
                                <div class="user-head-img mdui-img-circle" style="background: url(../../images/touxiang1.jpg);"></div>
                            </div>
                            <div class="mdui-col-md-7 mdui-typo">
                                <div>姓名：刘同学</div>
                                <div>学号：16851154</div>
                            </div>
                        </div>
                    </li>
                    <li class="mdui-divider"></li>
                    <li class="mdui-menu-item">
                        <a href="../Personal/notice.html" class="mdui-ripple">
                            <i class="mdui-menu-item-icon mdui-icon material-icons">notifications_none</i>我的通知
                        </a>
                        <a href="../Personal/message.html" class="mdui-ripple">
                            <i class="mdui-menu-item-icon mdui-icon material-icons">chat_bubble_outline</i>我的留言
                        </a>
                        <a href="../Personal/setting.html" class="mdui-ripple">
                            <i class=" mdui-menu-item-icon mdui-icon material-icons">settings</i>设置
                        </a>
                        <a href="../../login.html" class="mdui-ripple">
                            <i class=" mdui-menu-item-icon mdui-icon material-icons">exit_to_app</i>登出
                        </a>
                    </li>
                </ul>
            </div>

            <div class="mdui-tab mdui-color-deep-purple" mdui-tab>
                <a href="#tab1" class="mdui-ripple mdui-ripple-white">交流通知</a>
                <a href="#tab2" class="mdui-ripple mdui-ripple-white">作业通知</a>
                <a href="#tab3" class="mdui-ripple mdui-ripple-white">等待扩充···</a>
            </div>

        </div>
    </header>
    <!-- 顶部导航栏结束 -->

    <!-- 详细内容 -->
    <div class="mdui-container-fluid">
        <div id="tab1">
            <ul class="mdui-list">
                <li class="mdui-subheader-inset">2019-6-25</li>
                <li class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-avatar"><img src="../../images/avatar1.jpg" /></div>
                    <div class="mdui-list-item-content">
                        <div class="mdui-typo">
                            <a href="#"><span class="mdui-text-color-pink">刘同学</span></a> 回复了你的讨论
                            <a href="#"><span class="mdui-text-color-pink">进程有哪几种状态？</span></a>
                        </div>
                    </div>
                </li>

                <li class="mdui-subheader-inset">2019-6-10</li>
                <li class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-avatar"><img src="../../images/avatar2.jpg" /></div>
                    <div class="mdui-list-item-content">
                        <div class="mdui-typo">
                            <a href="#"><span class="mdui-text-color-pink">李同学</span></a> 回复了你的讨论
                            <a href="#"><span class="mdui-text-color-pink">进程有哪几种状态？</span></a>
                        </div>
                    </div>
                </li>
                <li class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-avatar"><img src="../../images/avatar4.jpg" /></div>
                    <div class="mdui-list-item-content">
                        <div class="mdui-list-item-content">
                            <div class="mdui-typo">
                                <a href="#"><span class="mdui-text-color-pink">李同学</span></a> 回复了你的讨论
                                <a href="#"><span class="mdui-text-color-pink">学习操作系统的6个简便方法</span></a>
                            </div>
                        </div>
                    </div>
                </li>
                <li class="mdui-subheader-inset">2019-6-6</li>
                <li class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-avatar"><img src="../../images/avatar3.jpg" /></div>
                    <div class="mdui-list-item-content">
                        <div class="mdui-typo">
                            <a href="#"><span class="mdui-text-color-pink">赵同学</span></a> 回复了你的讨论
                            <a href="#"><span class="mdui-text-color-pink">进程有哪几种状态？</span></a>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div id="tab2">
            <ul class="mdui-list">

                <li class="mdui-subheader-inset">2019-4-25</li>
                <li class="mdui-list-item mdui-ripple">
                    <i class="mdui-list-item-avatar mdui-icon material-icons">mode_edit</i>

                    <div class="mdui-list-item-content">
                        <div class="mdui-list-item-title">
                            <div class="mdui-typo">
                                <a href="#"><span class="mdui-text-color-pink">刘老师</span></a> 发布了作业
                                <a href="#"><span class="mdui-text-color-pink">第五次作业标题</span></a>
                            </div>
                        </div>
                        <div class="mdui-list-item-text mdui-list-item-two-line">
                            作业要求：今天做第一章第二节课后习题1、2、4、7，下次上课前交。 关于本次作业写了一个作业解析，需要在作业完成状态后，才可查看。 本次模拟有作业解析的情况，并且处于进行中状态。所以无法查看解析。
                        </div>
                    </div>
                </li>

                <li class="mdui-subheader-inset">2019-4-19</li>
                <li class="mdui-list-item mdui-ripple">
                    <i class="mdui-list-item-avatar mdui-icon material-icons">insert_drive_file</i>

                    <div class="mdui-list-item-content">
                        <div class="mdui-list-item-title ">
                            <div class="mdui-typo">
                                <a href="#"><span class="mdui-text-color-pink">刘老师</span></a> 发布了作业
                                <a href="#"><span class="mdui-text-color-pink">第三次作业标题</span></a>
                            </div>
                        </div>
                        <div class="mdui-list-item-text mdui-list-item-two-line">
                            作业要求：今天做第一章第二节课后习题1、2、4、7，下次上课前交。 关于本次作业写了一个作业解析，需要在作业完成状态后，才可查看。 本次模拟有作业解析的情况，并且处于进行中状态。所以无法查看解析。
                        </div>
                    </div>
                </li>

                <li class="mdui-list-item mdui-ripple">
                    <i class="mdui-list-item-avatar mdui-icon material-icons">mode_edit</i>

                    <div class="mdui-list-item-content">
                        <div class="mdui-list-item-title ">
                            <div class="mdui-typo">
                                <a href="#"><span class="mdui-text-color-pink">刘老师</span></a> 发布了作业
                                <a href="#"><span class="mdui-text-color-pink">第四次作业标题</span></a>
                            </div>
                        </div>
                        <div class="mdui-list-item-text mdui-list-item-two-line">
                            作业要求：今天做第一章第二节课后习题1、2、4、7，下次上课前交。 关于本次作业写了一个作业解析，需要在作业完成状态后，才可查看。 本次模拟有作业解析的情况，并且处于进行中状态。所以无法查看解析。
                        </div>
                    </div>
                </li>

            </ul>
        </div>
        <div id="tab3">
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
            <p>tab 3</p>
        </div>
    </div>

    <!-- 底部页脚 -->
    <footer class="mdui-container-fluid mdui-text-center mdui-m-t-2">
        <div class="mdui-bottom-nav">
            <p class="mdui-ripple mdui-container-fluid mdui-valign">Copyright © 2019 北京交通大学海滨学院</p>
        </div>
    </footer>

    <script src="../../js/mdui.js"></script>
</body>

</html>